<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Employee Listing</title>
	<link href="../raxan/ui/css/master.css" rel="stylesheet" type="text/css" />
	<!--[if lt IE 8]><link rel="stylesheet" href="../raxan/ui/css/master.ie.css" type="text/css"><![endif]-->
	<link href="../raxan/ui/css/default/theme.css" rel="stylesheet" type="text/css" />
        <style type="text/css">
            .title {
                padding:10px;
                border-width: 2px;
                margin-bottom: 0;
            }
            #pager {
                border-width: 2px;
                margin-right: 10px;
                margin-bottom: 10px;
            }
            #pager a {
                vertical-align: middle;
                display: inline-block !important;
                display: inline; /* for ie6  */
                width: 16px;
                height: 16px;
                padding: 3px;
                text-align: center;
                margin-right: 1px;
            }
            
            .note {
                padding: 10px;
                clear: both;
                border-top: solid 1px #bbb;
                color: #555;
            }
        </style>
</head>

<body>
    <div class="container c30 prepend-top">
        <div class="rax-backdrop">
            <div class="rax-content-pal">
                <h2 class="title rax-header-pal round-top rax-metalic" ><img src="views/images/people.png" width="36" height="36" class="align-middle rtm"  />Employee Directory</h2>
                <div class="flashmsg"></div>
                <div id="panel1" class="container">
                    <table id="emplist" class="rax-table mouse-cursor" cellpadding="0" cellspacing="0">
                        <thead>
                            <tr class="tbl-header">
                                <td>&nbsp;</td><td class="c3">Emp #</td><td class="c10">Name</td><td>Gender</td><td>Birth Date</td>
                            </tr>
                        </thead>
                        <tbody id="emplistBody">
                            <tr class="{ROWCLASS}" data-event-value="{emp_no}">
                                <td>{ROWCOUNT}</td><td>{emp_no}</td><td>{name}</td><td>{gender}</td><td>{birth_date}</td>
                            </tr>
                        </tbody>
                    </table>
                    <div id="pager" class="right"></div>
                    <div class="note rax-glass round-bottom">Click to selected a record. Press the Ctrl (PC) or Meta (MAC) key to select multiple rows.</div>
                </div>
            </div>
        </div>
    </div>

</body>

</html>